<template>
  <ul class="nav">
      <li>
         <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png"  />
         <div>嗨购超市</div>
       </li>
       <li>
        <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/178015/31/13828/6862/60ec0c04Ee2fd63ac/ccf74d805a059a44.png"  />
         <div>数码电器</div>
       </li>
       <li>
        <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/41867/2/15966/7116/60ec0e0dE9f50d596/758babcb4f911bf4.png"  />
         <div>嗨购服饰</div>
       </li>
       <li>
        <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/177902/16/13776/5658/60ec0e71E801087f2/a0d5a68bf1461e6d.png"  />
         <div>嗨购生鲜</div>
       </li>
       <li>
         <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/196472/7/12807/7127/60ec0ea3Efe11835b/37c65625d94cae75.png" />
         <div>嗨购到家</div>
       </li>
       <li>
         <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/185733/21/13527/6648/60ec0f31E0fea3e0a/d86d463521140bb6.png" />
         <div>充值缴费</div>
       </li>
       <li>
         <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/36069/14/16068/6465/60ec0f67E155f9488/595ff3e606a53f02.png"  />
         <div>9.9元拼</div>
       </li>
       <li>
         <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/186080/16/13681/8175/60ec0fcdE032af6cf/c5acd2f8454c40e1.png" />
         <div>领券</div>
       </li>
       <li>
         <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/196711/35/12751/6996/60ec1000E21b5bab4/38077313cb9eac4b.png" />
         <div>领金贴</div>
       </li>
       <li>
         <img src="https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/37709/6/15279/6118/60ec1046E4b5592c6/a7d6b66354efb141.png"  />
         <div>plus会员</div>
       </li>
  </ul>
</template>

<script>
export default {
  data(){
    return {
     msg:'嗨购'
    }
  }
}
</script>

<style scoped>
  ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: white;
  }

  ul li{
    width: 18%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: .625rem 0;
  }

  ul li img{
    width: 100%;
    margin-bottom: .625rem;
  }

</style>